<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name='viewport' content='width=device-width; initial-scale=1; maximum-scale=1; minimum-scale=1; user-scalable=no;'>
        <title>Layui-Demo</title>
        <link rel="stylesheet" type="text/css" href="layui/css/layui.css">
        <link rel="stylesheet" type="text/css" href="layui/css/layui.mobile.css">
        <style>
            .layui-tab{
                margin:0;
                padding:0;
            }
        </style>
    </head>
    <body>
        <div class="layui-tab layui-tab-brief">
            <ul class="layui-tab-title">
                <li class="layui-this">网站设置</li>
                <li>用户管理</li>
                <li>权限分配</li>
                <li>商品管理</li>
                <li>订单管理</li>
            </ul>
            <div class="layui-tab-content">
                <div class="layui-tab-item layui-show">内容1</div>
                <div class="layui-tab-item">内容2</div>
                <div class="layui-tab-item">内容3</div>
                <div class="layui-tab-item">内容4</div>
                <div class="layui-tab-item">内容5</div>
            </div>
        </div>
        <script src="layui/layui.js"></script>
        <script>
            //注意：选项卡 依赖 element 模块，否则无法进行功能性操作
            layui.use('element', function(){
                var element = layui.element;
                
                //…
            });
        </script>
    </body>
</html>